<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<style type="text/css">
			.price-calendar-bounding-box,
			.date-box {
				width: 100%!important;
			}
			
			.price-calendar-bounding-box .content-box,
			.price-calendar-bounding-box .content-box .inner {
				border: 0!important;
			}
		</style>
	</head>

	<body>
		<script src="http://yui.yahooapis.com/3.5.1/build/yui/yui-min.js"></script>
		<script src="../mui/js/mui.min.js"></script>
		<script src="../js/myStorage.js"></script>
		<script type="text/javascript">
			mui.init({
				preloadPages: [{
					id: 'index.html',
					url: 'index.html'
				}],
				swipeBack: true //启用右滑关闭功能
			});
			var config = {
				modules: {
					'price-calendar': {
						fullpath: 'price-calendar.js', //根据项目路径调整
						type: 'js',
						requires: ['price-calendar-css']
					},
					'price-calendar-css': {
						fullpath: 'price-calendar.css', //根据项目路径调整
						type: 'css'
					}
				}
			};
			YUI(config).use('price-calendar', 'jsonp', function(Y) {
				var sub = Y.Lang.sub;
				var url = 'http://fgm.cc/learn/calendar/price-calendar/getData.asp?minDate={mindate}&maxDate={maxdate}&callback={callback}';

				//价格日历实例    
				var oCal = new Y.PriceCalendar();
				//当前日期
				var myDate = new Date();
				var year = myDate.getYear(); //获取当前年份(2位)  
				var fullyear = myDate.getFullYear(); //获取完整的年份(4位,1970-????)  
				var Month = myDate.getMonth() + 1; //获取当前月份(0-11,0代表1月)  
				var Day = myDate.getDate(); //获取当前日(1-31)  
				var xinqi = myDate.getDay(); //获取当前星期X(0-6,0代表星期天)
				//点击确定按钮
				var indexPage = null;
				oCal.on('confirm', function() {
//					alert('入住时间：' + this.get('depDate') + '\n离店时间：' + this.get('endDate'));
					var depDate = this.get('depDate');
					var leaveDate = this.get('endDate');
//					localStorage.setItem('depDate', depDate);
//					localStorage.setItem('endDate', endDate);
//					mui.back(); // 不能在这里就back，因为这里back以后，就不会执行下面的mui.openWindow函数，选中的日期就无法返回首页

					//添加列表项的点击事件

					var id = 123;
					//获得详情页面
					if(!indexPage) {
						indexPage = plus.webview.getWebviewById('index.html');
					}
					//触发详情页面的newsId事件
					mui.fire(indexPage, 'dataId', {
						depDate: depDate,
						endDate: leaveDate
					});
					//打开详情页面          
					mui.openWindow({
						id: 'index.html'
					});

				});

				//点击取消按钮
				oCal.on('cancel', function() {
					this.set('depDate', '').set('leaveDate', '').render();
				});

				//开始日期
				var min = fullyear + "-" + Month + "-" + Day
				oCal.set('data', null)
					.set('count', '1')
					.set('depDate', '')
					.set('leaveDate', '')
					.set('minDate', min)
					.set('maxDate', '2017-12-14')
					.set('afterDays', '2017-12-14');
				Y.jsonp(
					sub(url, {
						mindate: oCal.get('minDate'),
						maxdate: oCal.get('maxDate')
					}), {
						on: {
							success: function(data) {
								oCal.set('data', data);

							}
						}
					}
				);
				//				Y.one('#J_Example').delegate('click', function(e) {
				//					var that = this,
				//						oTarget = e.currentTarget;
				//					switch(true) {
				//						//设置日历显示个数
				//						case oTarget.hasClass('J_Count'):
				//							this.set('count', oTarget.getAttribute('data-value')).render();
				//							console.log( oTarget.getAttribute('data-value'))
				//							break;
				//							//时间范围限定
				//						case oTarget.hasClass('J_Limit'):
				//							this.set('data', null)
				//								.set('depDate', '')
				//								.set('endDate', '')
				//								.set('minDate', '')
				//								.set('afterDays', oTarget.getAttribute('data-limit'));
				//							if(!oTarget.hasAttribute('data-date')) {
				//								this.set('date', new Date())
				//							} else {
				//								var oDate = oTarget.getAttribute('data-date');
				//								this.set('minDate', oDate);
				//								this.set('date', oDate);
				//							}
				//							oTarget.ancestor().one('.J_RoomStatus') ?
				//								oTarget.ancestor().one('.J_RoomStatus').setContent('\u663e\u793a\u623f\u6001').removeClass('J_Show') :
				//								oTarget.ancestor().append('<button class="J_RoomStatus">\u663e\u793a\u623f\u6001</button>');
				//							break;
				//							//异步拉取酒店数据
				//						case oTarget.hasClass('J_RoomStatus'):
				//							oTarget.toggleClass('J_Show');
				//							if(oTarget.hasClass('J_Show'))
				//								Y.jsonp(
				//									sub(url, {
				//										mindate: this.get('minDate'),
				//										maxdate: this.get('maxDate')
				//									}), {
				//										on: {
				//											success: function(data) {
				//												that.set('data', data);
				//												oTarget.setContent('\u9690\u85cf\u623f\u6001')
				//											}
				//										}
				//									}
				//								);
				//							else {
				//								this.set('data', null);
				//								oTarget.setContent('\u663e\u793a\u623f\u6001');
				//							}
				//							break;
				//					}
				//				}, 'button', oCal);
			});
		</script>

	</body>

</html>